<template>
  <div v-loading="loading" class="nb-table">
    <!--<div>{{ height }}</div>-->
    <el-table
      border
      v-bind="$props"
      :data="Data.rows"
      style="width: 100%"
      :height="heightSize"
      :fit="true"
      ref="multipleTable"
    >
      <el-table-column
        v-if="checkbox"
        type="selection"
        width="45"
      />
      <el-table-column
        label="序号"
        type="index"
        width="50"
        align="center"
      >
        <template scope="scope">
          <!-- 有分页时，序号显示 -->
          <span v-if="pagination">{{ (DtpageNo - 1) * pageSize + scope.$index + 1 }}</span>
          <!-- 无分页时，序号显示 -->
          <span v-else>{{ scope.$index + 1 }}</span>
        </template>
      </el-table-column>
      <tree-column v-for="column in columns" :key="uuid()" :column="column">
        <template v-if="column.slotName" v-slot:[column.slotName]="scope">
          <slot
            :name="column.slotName"
            :index="scope.index"
            :row="scope.row"
            v-bind="column"
          />
        </template>
      </tree-column>
      <!--      <el-table-column
        v-for="(column,index) in columns"
        :key="index"
        :prop="column.field"
        :label="column.label"
        :width="column.width"
        :fixed="column.fixed"
        :formatter="column.formatter"
        align="center"
        :show-overflow-tooltip="column.tip"
      >
        <template slot-scope="scope">
          <slot
            v-if="column.slot"
            :name="column.slot"
            :index="scope.$index"
            :column="column"
            :row="scope.row"
          />
          <div v-else>
            {{ scope.row[column.field] }}
          </div>
        </template>
      </el-table-column>-->
    </el-table>
    <div v-if="pagination" class="comm-table-page">
      <el-pagination
        layout="total, prev, pager, next"
        :current-page.sync="DtpageNo"
        :page-size="pageSize"
        :total="Data.total"
        @current-change="pageChange"
      />
    </div>
  </div>
</template>

<script src="./assets/index.js"></script>
